<template>
  <section class="app-main allPage">
    <transition name="fade" mode="out-in">
      <!-- <router-view :key="key"></router-view> -->
      <router-view v-if="isRouterAlive"></router-view>
    </transition>
  </section>
</template>

<script>
export default {
  name: 'AppMain',
  data() {
    return {
      isRouterAlive: true,
    }
  },
  provide() {
    return {
      reload: this.reload,
    }
  },
  methods: {
    reload() {
      this.isRouterAlive = false
      this.$nextTick(() => {
        this.isRouterAlive = true
      })
    },
  },
  computed: {
    // key() {
    //   return this.$route.name !== undefined ? this.$route.name + + new Date() : this.$route + + new Date()
    // }
  },
}
</script>
<style scoped>
.allPage{
  position: absolute;
  top:0px;
  bottom: 0px;
  overflow-y: auto;
  width: 100%;
  height:100%
}
</style>
